<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" th:href="@{/static/layui/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/static/css/thesame.css}" media="all">
    <link rel="stylesheet" th:href="@{/static/css/page.css}" media="all">
    <link rel="stylesheet" th:href="@{/static/framework/css/rightCon.css}" media="all">
</head>

<body class="layui-layout-body">
<div class="layui-body ">
    <!-- 内容主体区域 -->
    <div class="scroll-box">
        <div class="scroll-box-con">
            <div class="pad16px border-radius4 bgWhite">
                <div class="new-data-btn mb16px lh30px overflow">
                    <p class="left"><span class="white border-radius4 bgBlue inline-block cursor" onclick="addPage()"><img th:src="@{/static/framework/img/button_add.png}">新建角色</span></p>
                    <p class="right"><span class="block">共<em class="red" id="count"></em>条数据</span></p>
                </div>
                <div class="table-right">
                    <table class="layui-hide" id="test" lay-filter="test"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<script th:src="@{/static/js/jquery-3.1.1.min.js}" charset="utf-8"></script>
<script th:src="@{/static/layui/layui.js}" charset="utf-8"></script>
<script th:inline="javascript">


    var basePath = [[${#request.getContextPath()}]];

    $(function () {

        getData();
    });


    function getData() {
        layui.use(['element', 'laydate', 'layer', 'form', 'table'], function () {
            var layer = layui.layer;
            var table = layui.table;
            //查询条件

            table.render({
                elem: '#test',
                url: "../role/getRoleList"
                , where: {},
                id: 'idTest'
                , request: {
                    pageName: 'page' //页码的参数名称，默认：page
                    , limitName: 'limit' //每页数据量的参数名，默认：limit
                },
                page: true //开启分页
                , limit: 10 //每页显示的条数
                //,limits:[3,4,5]
                , groups: 9 //连续页码个数
                , parseData: function (res) {
                    console.log(res);
                    return {
                        "code": res.code,
                        "data": res.data,
                        "count": res.count,
                    };
                },
                cols: [
                    [
                        {
                            field: 'name',
                            title: '角色名称',
                        }, {
                        field: 'roleDesc',
                        title: '角色描述',
                    }, {
                        field: 'pNum',
                        title: '授权用户数',
                    }, {
                        field: 'sign',
                        title: '系统预设',
                        templet: function (res) {
                            var preinstall = res.preinstall;
                            var html = preinstall == 1 ? html = "<img src='" + basePath + "/static/framework/img/icon_xtys.png'>" : "";
                            return html;
                        }
                    }, {
                        field: 'operation',
                        title: '操作',
                        style: 'color:#1C9399;',
                        width: '200',
                        fixed: 'right',
                        templet: function (res) {
                            if (res.preinstall == 1) {
                                return "<div class='table-list-btn'><span onclick=\"editById('" + res.id + "')\" class='blue'>查看</span></div>"
                            } else {
                                return "<div class='table-list-btn'><span onclick=\"editById('" + res.id + "')\" class='blue'>查看</span>|<span onclick=\"editById('" + res.id + "')\" class='blue'>编辑</span>|<span onclick=\"editById('" + res.id + "')\" class='blue'>删除</span></div>"
                            }
                        }
                    }
                    ]
                ], done: function (res, curr, count) {
                    $("#count").text(count);
                }
            });
        })
    }

    function addPage() {
        window.location.href = "../role/toRoleAddPage";
    }


    /**
     * 跳转到修改角色
     */
    function editRole(roleNo){
        window.location.href=basePath+"/sysRole/editPage?roleNo="+roleNo;
    }

    /**
     * 跳转到查看用户
     */
    function queryRole(roleNo){
        window.location.href=basePath+"/sysRole/infoPage?roleNo="+roleNo;
    }

    /**
     * 删除角色
     */
    function deleteRole(id) {
        $.ajax({
            url:basePath+"/sysRole/delete",
            type:"post",
            dataType:"json",
            data:{"roleNo":id},
            success:function (result) {
                if(result.code == 200){
                    layerResult("删除成功",1);
                }else{
                    layerResult(result.msg,2);
                }
            }
        })
    }

</script>
</body>

</html>
